Servers-File Structure Hierarchy

All of the files pictured above are included in the projects main folder, which is often referred to as the project 'root'. After making sure your project folders are setup in this way, the only thing you need to do is write one line of code in the server.js file that points the server code to the folder that has the index.html and any additional pages. In the example above the name of that folder is website, so in the server.js file the following line of code needs to be added:

app.use(express.static('website'));

This line of code connects our server-side code (the code in the server.js file) to our client-side code (the browser code written in the files housed in the website folder).

In this lesson, we covered how to create a server to run a web app locally in your browser, and to setup the ability to pass code between different parts of a web app through routes. We also covered the folder structure for web apps with an Express server. We will cover routes in the next lesson.

More on Express servers

For more information on Express you can visit their website, or see this basic example of an Express server.